import React, { Component } from "react";
import Child from "./Children";
import { context, resume } from "./context";
import About from "./about";
/*
已知组件 contextParent  contextChild   contextChild2
contextParent 为父组件
contextChild  为contextParent 子组件
contextChild2 为contextChild 子组件

已知context 数据结构
const resume = {
    base:{
        name:'',
        age:'',
        genders:'male'
    },
    exp:{
        year:'',
        comp:'',
        job:'',
        detail:'',
        area:'lime'
    }
}
contextChild2 可以直接获取到resume.base.genders 值
达到要求
一、直接在页面显示出genders 值
二、通过didMount 中 打印出来genders 值
*/
class index extends Component {
  constructor() {
    super();
    this.state = {
      base: { name: "", age: "", genders: "male" },
    };
  }
  _init() {
    this.setState({
      base: {
        name: "新名字",
        age: "32",
        genders: "nv",
      },
    });
  }
  componentDidMount() {
    setTimeout(() => {
      this._init();
    }, 2000);
  }
  contextFn(txt) {
    console.log(txt);
  }
  left() {
    return <div>left</div>;
  }
  com() {
    return <About contextFn={this.contextFn} />;
  }
  render() {
    console.log(resume);
    return (
      <>
        {this.com()}
        {/* <context.Provider
          value={{
            base: this.state.base, //基础数据类型
            callback: this.contextFn, //子组件回调 信息返回
            left: this.left, //直接接收某些内容
            com: this.com, //可以直接接收某个组件
          }}
        >
          <Child />
        </context.Provider> */}
      </>
    );
  }
}

export default index;
